<template>
  <div>
    <setHeader title="企业修改" settext="提交" @done="gotobtn()"></setHeader>
    <div class="pagecontent">
      <!-- 表单 -->
      <div class="el-main">
        <div class="form" ref="authForm" :model="authForm" :rules="authRules">
          <!-- 个人头像 -->
          <div class="title_text_more main-people-img" prop="logImg">
            <h3>个人头像</h3>
            <el-upload
              class="avatar-uploaderTwo"
              :action="importFileUrl"
              :show-file-list="false"
              :on-success="handleAvatarSuccessTwo"
              :before-upload="beforeAvatarUploadTwo">
              <img v-if="imageUrlLog" :src="imageUrlLog" class="avatar">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </div>
          <div class="write_input_box write-label" prop="companyName">
              <label for="" class="write-require">企业名称</label>
              <input type="text" v-model="authForm.companyName" auto-complete="off" maxlength="20" placeholder="请输入你的企业名称">
          </div>
          <div class="write_input_box write-label" prop="trueName">
              <label for="" class="write-require">真实姓名</label>
              <input type="text" v-model="authForm.trueName" auto-complete="off" maxlength="20" placeholder="请输入你的真实姓名">
          </div>
          <div class="write_input_box write-label" prop="job">
              <label for="" class="write-require">你的职位</label>
              <input type="text" v-model="authForm.job" auto-complete="off" maxlength="15" placeholder="请输入你的职位">
          </div>
          <div class="write_input_box write-label">
              <label for="">企业法人</label>
              <input type="text" placeholder="请输入企业法人的名称">
          </div>
          <div class="write_input_box write-label">
              <label for="">企业电话</label>
              <input type="text" placeholder="请输入你的企业电话">
          </div>
          <div class="write_input_box write-label">
              <label for="">企业税号</label>
              <input type="text" placeholder="请输入你的企业税号">
          </div>
          <div class="write_input_box write-label">
              <label for="">注册资金</label>
              <input type="text" placeholder="请输入你的注册资金">
          </div>
          <div class="write_input_box write-label clear">
              <label for="">注册时间</label>
              <datepicker
                  class="pmanage__datepicker"
                  :language="zh"
                  format="yyyy-MM-dd"
                  placeholder="请选择你的注册时间"
                  input-class="pmanage__datepicker__input"
              ></datepicker>
          </div>
          <div class="write_input_box write-label">
              <label for="">企业规模</label>
              <input type="text" placeholder="请输入你的企业规模">
          </div>
          <div class="write_input_box write-label write-textarea" prop="description">
              <label for="">企业简介</label>
              <textarea class="company_editor_link" name="" id="" cols="20" :rows="5" v-model="authForm.description" auto-complete="off" :maxlength="120" placeholder="请输入内容"></textarea>
          </div>

          <div class="btn_big_red" @click="handleSubmit2" style="margin-top: 0.9rem;">
                <button>提交修改</button>
          </div>
        </div>
      </div>
    <!-- <el-main>
      <el-form ref="authForm" :model="authForm" :rules="authRules" label-width="80px">

        <el-form-item prop="logImg" label="个人头像">
          <el-upload
            class="avatar-uploaderTwo"
            :action="importFileUrl"
            :show-file-list="false"
            :on-success="handleAvatarSuccessTwo"
            :before-upload="beforeAvatarUploadTwo">
            <img v-if="imageUrlLog" :src="imageUrlLog" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item prop="companyName" label="企业名称" hide-required-asterisk="true">
          <el-input type="text" v-model="authForm.companyName" auto-complete="off" maxlength="20" placeholder="请输入你的企业名称" size="medium" ></el-input>
        </el-form-item>
          <el-form-item prop="description" label="企业简介" hide-required-asterisk="true"> --> -->
          <!-- <el-input type="text" v-model="authForm.description" auto-complete="off" maxlength="8" placeholder="请输入你的企业简介" size="medium"></el-input> -->
         <!-- <el-input
            type="textarea"
            :rows="4"
            :maxlength="120"
            placeholder="请输入内容"
            v-model="authForm.description">
          </el-input>
        </el-form-item>
        
        <el-form-item prop="trueName" label="真实姓名" hide-required-asterisk="true">
          <el-input type="text" v-model="authForm.trueName" auto-complete="off" maxlength="20" placeholder="请输入你的真实姓名" size="medium"></el-input>
        </el-form-item>
        <el-form-item prop="job" label="你的职位">
          <el-input type="text" v-model="authForm.job" auto-complete="off" maxlength="15" placeholder="请输入你的职位" label=""></el-input>
        </el-form-item> --> 
        <!-- <el-form-item label="营业执照：" label-width="85px" class="yyzz"></el-form-item>
        <p class="notes">仅支持JPG,JPEG和PNG格式, 大小不超过200兆,<br/> 文字清晰可辨。
         企业名称必须与您填写的一致。</p>
        <el-upload
          class="avatar-uploader"
          :action="importFileUrl"
          :show-file-list="false"
          :on-success="handleAvatarSuccess"
          :before-upload="beforeAvatarUpload">
          <img v-if="imageUrl" :src="imageUrl" class="avatar">
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload> -->
         <!-- <el-button type="danger" style="width:100%;" @click.native.prevent="handleSubmit2" class="subBtn">提交修改</el-button>
      </el-form>
    </el-main>  -->
  <!-- <el-container> -->
    <!--<el-header class="top" height="64px">
      <i class="el-icon-arrow-left"></i>
      <h4>企业修改</h4>
       <el-button icon="el-icon-search" class="el-circle-index-search el-circle-index" round></el-button> 
    </el-header>-->
    <!-- <el-main>
      <el-form ref="authForm" :model="authForm" :rules="authRules" label-width="80px">

        <el-form-item prop="logImg" label="个人头像">
          <el-upload
            class="avatar-uploaderTwo"
            :action="importFileUrl"
            :show-file-list="false"
            :on-success="handleAvatarSuccessTwo"
            :before-upload="beforeAvatarUploadTwo">
            <img v-if="imageUrlLog" :src="imageUrlLog" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item prop="companyName" label="企业名称" hide-required-asterisk="true">
          <el-input type="text" v-model="authForm.companyName" auto-complete="off" maxlength="20" placeholder="请输入你的企业名称" size="medium" ></el-input>
        </el-form-item>
          <el-form-item prop="description" label="企业简介" hide-required-asterisk="true"> -->
          <!-- <el-input type="text" v-model="authForm.description" auto-complete="off" maxlength="8" placeholder="请输入你的企业简介" size="medium"></el-input> -->
          <!-- <el-input
            type="textarea"
            :rows="4"
            :maxlength="120"
            placeholder="请输入内容"s
            v-model="authForm.description">
          </el-input>
        </el-form-item>
        
        <el-form-item prop="trueName" label="真实姓名" hide-required-asterisk="true">
          <el-input type="text" v-model="authForm.trueName" auto-complete="off" maxlength="20" placeholder="请输入你的真实姓名" size="medium"></el-input>
        </el-form-item>
        <el-form-item prop="job" label="你的职位">
          <el-input type="text" v-model="authForm.job" auto-complete="off" maxlength="15" placeholder="请输入你的职位" label=""></el-input>
        </el-form-item> -->
        <!-- <el-form-item label="营业执照：" label-width="85px" class="yyzz"></el-form-item>
        <p class="notes">仅支持JPG,JPEG和PNG格式, 大小不超过200兆,<br/> 文字清晰可辨。
         企业名称必须与您填写的一致。</p>
        <el-upload
          class="avatar-uploader"
          :action="importFileUrl"
          :show-file-list="false"
          :on-success="handleAvatarSuccess"
          :before-upload="beforeAvatarUpload">
          <img v-if="imageUrl" :src="imageUrl" class="avatar">
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload> -->
        <!-- <el-button type="danger" style="width:100%;" @click.native.prevent="handleSubmit2" class="subBtn">提交修改</el-button>
      </el-form>
    </el-main> 
  </el-container>-->
    </div>
    <so-footer></so-footer>
</div>
</template>

<script>
import setHeader from '../public/setHeader.vue';
import soFooter from '../components/footer-bar';
import Datepicker from 'vuejs-datepicker';
import { zh } from 'vuejs-datepicker/dist/locale'
import { MessageBox } from 'mint-ui';
  export default {
    name: 'search',
    data() {
      return {
        zh: zh,
        timeout: null,
        auth: false,
        authForm: {
          companyName: '',
          trueName: '',
          job: '',
          description: ''
        },
        imageUrl: this.$path+'',
        imageUrlLog: this.$path+'',

        authRules: {
          companyName: [
            { required: true, message: '请输入企业名称', trigger: 'blur' },
            { min: 4, max: 25, message: '长度在 4 到 25 个字符', trigger: 'blur' },
          ],
          trueName: [
            { required: true, message: '请输入你的真实姓名', trigger: 'blur' },
            { min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' },
          ],
          job: [
            { required: true, message: '请输入你的职位', trigger: 'blur' },
          ]
        },
        checked: true,
        licenseImgPath: '',
        logImgPath: '',

        title: '',
        search: [],
        cp_id: '',
        flag: false,
        uploadImgUrl: this.$path+'api.php/Upload/upimage',

        head_img: '',
        lice_img: '',
        importFileUrl:this.$path+'/api.php/upload/upimage',
        userInfo: '',
      };

    },
 components:{
      setHeader,
      soFooter,
      Datepicker
    },
    created() {
      let that = this;
      that.userInfo = window.localStorage.getItem('userInfo');
      that.userInfo = JSON.parse(that.userInfo);
      // 获取修改数据
      that.getCompanyInfo(that.cp_id,that.userInfo.id);
    },
    mounted:function () {
      // let that = this;
      // var user = Promise.resolve(this.getUserInfo())
      // user.then(
      //   function (result) {
      //   that.userInfo = result;
      //   // 获取修改数据
      //   that.getCompanyInfo(that.cp_id,result.id);
      // })
      this.cp_id = this.$route.query.cp_id
    },
    methods: {
        
      getCompanyInfo(cp_id,userId){
        this.$fetch(this.$path + '/api.php/company/getCompanyIndexInfo',{cp_id,userId}).then((response) => {
          this.imageUrlLog = this.$path+response.data.log_img
          this.imageUrl = this.$path+response.data.license_img
          this.head_img = response.data.log_img
          // this.lice_img = response.data.license_img

          this.authForm.job = response.data.admin_job
          this.authForm.companyName = response.data.name
          this.authForm.description = response.data.description
          this.authForm.trueName = response.data.admin_name
        })
      },
      handleSubmit2(ev) {
        var formData = new FormData()
        var _this = this
        var companyName = this.authForm.companyName
        var adminName = this.authForm.trueName
        var adminJob = this.authForm.job
        var licenseImg = this.licenseImgPath ? this.licenseImgPath :this.lice_img
        var log_img = this.logImgPath ? this.logImgPath :this.head_img
        var description = this.authForm.description
        var cp_id = this.cp_id
        var userId = this.userInfo.id
        if(!log_img){
          this.$message.error('请上传头像')
          return false
        }
        if(!description){
          this.$message.error('请完善公司简介')
          return false
        }

        this.$refs.authForm.validate((valid) => {
            if(valid){ 
            this.$fetch(this.$path + '/api.php/company/updateCompanyInfo', {companyName,adminName,adminJob,log_img,description,cp_id,userId}).then((response) => {
              if(response.code != 200){
              	MessageBox.alert(response.msg).then(action => {
		                	this.$router.push({path: '/companyCreate'}); 
		        });
                
              }else{
              	MessageBox.alert(response.msg).then(action => {
		                this.$router.push({path: '/userCenter/companyData', query: {cpId: this.cp_id}})
                        this.$refs['authForm'].resetFields()
		        });
                  
              } 
              })
            } 
        });
      },

      // 头像begin
      handleAvatarSuccessTwo(res, file) {
        this.logImgPath = res.headpath;
        this.imageUrlLog = URL.createObjectURL(file.raw);
        console.log(this.logImgPath);
      },
      beforeAvatarUploadTwo(file) {
        const isJPG = file.type === 'image/jpeg';
        const isPNG = file.type === 'image/png';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG && !isPNG) {
          this.$message.error('上传头像图片只能是 JPG 或 PNG 格式!');
          return false;
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
          return false;
        }
      },
      // 头像end

      // 营业执照begin
    /*  handleAvatarSuccess(res, file) {
        this.licenseImgPath = res.headpath;
        this.imageUrl = URL.createObjectURL(file.raw);
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isPNG = file.type === 'image/png';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG && !isPNG) {
          this.$message.error('上传头像图片只能是 JPG 或 PNG 格式!');
          return false;
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
          return false;
        }
      },*/
      // 营业执照end
    }
  }

</script>
<style >
@import '../common/css/companyUpdate.css';
/* 个人头像 */
.main-people-img {
  height: 1rem;
  line-height: 1rem;
  margin-bottom: 0.2rem;
}
.main-people-img h3{
  font-size: 0.28rem;
  color: #333;
  font-weight: 500;
}
/* 表单 */
.el-main {
  padding: 0;
}
.write_input_box label {
  width: 1.6rem;
}

.write-label input {
  width: 72% !important;
}
.write-require::before {
    content: "*";
    color: #e50838;
    margin-left: -0.1rem;
}
/* 时间控件 */
.pmanage__datepicker  {
    width: 76%;
    height: 0.96rem;
    outline: none;
    font-size: 0.26rem;
    float: right;
}
.pmanage__datepicker .pmanage__datepicker__input {
    width: 100% !important;
}
.vdp-datepicker__calendar {
  width: 100%;
}
.vdp-datepicker__calendar .cell.selected {
  background-color: #e50838;
}
/* 企业简介 */
.write-textarea {
    display: flex;
    justify-content: flex-start;
    height: auto;
}
.company_editor_link {
    float: right;
    width: 76%;
    display: block;
    resize: vertical;
    padding: 0.2rem;
    line-height: 1.5;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: inherit;
    color: #333;
    background-color: #fff;
    background-image: none;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    margin-top: 0.2rem;
}
.write-require {
  color: #e50838;
  font-size: 0.28rem;
  font-style: normal;
  vertical-align: middle;
}
</style>
